<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用户主页</title>
		<script type="text/javascript">
			/* 实现下一页按钮的事件 */
			function nextPage(){
				var offsetObj = document.pageForm.offset;
				if(parseInt(offsetObj.value) === parseInt('${pages}')-1){
					alert("已经是最后一页");
					return;
				}
				offsetObj.value = parseInt(offsetObj.value)+1;
				document.pageForm.submit();
			}
			/* 实现上一页的事件 */
			function prePage(){
				var offsetObj = document.pageForm.offset;
				console.log(offsetObj.value);
				if(parseInt(offsetObj.value) === 0){
					alert("已经是第一页");
					return;
				}
				offsetObj.value = parseInt(offsetObj.value)-1;
				document.pageForm.submit();
			}
			/* 实现回到首页的事件 */
			function indexPage(){
				var offsetObj = document.pageForm.offset;
				offsetObj.value = 0;
				document.pageForm.submit();
			}
			/* 实现每一页的事件 */
			function varPage(){
				var offsetValue = arguments[0].value;
				document.pageForm.offset.value = parseInt(offsetValue)-1;
				document.pageForm.submit();
			}
		</script>
	</head>
	<body>
		<h1 align="center">用户主页</h1>
		<table border="1" align="center">
			<tr>
				<th>id</th>
				<th>用户名</th>
				<th>密码</th>
				<th>删除</th>
			</tr>
			<c:forEach items="${allUsers }" var="user">
				<tr>
					<td>${user.id }</td>
					<td>${user.username }</td>
					<td>${user.userpass }</td>
					<td><a href="#">删除</a></td>
				</tr>
			</c:forEach>
		</table>
		<div align="center">
			<form action="IndexServlet" method="post" name="pageForm">
				<input type="hidden" value="${rows }" name="rows">
				<input type="hidden" value="${offset }" name="offset">
				<input type="button" value="首页" onclick="indexPage()">
				<input type="button" value="上一页" onclick="prePage()">
				<c:forEach begin="1" end="${pages }" varStatus="s">
					<input type="button"  value="${s.count }" onclick="varPage(this)">
				</c:forEach>
				<input type="button" value="下一页" onclick="nextPage()">
				总记录数：${count }
				总页数：${pages }
			</form>
		</div>
	</body>
</html>